<template>
  <div class="login-wp">
    <header class="bar bar-nav">
      <a
        class="button button-link button-nav pull-left goBack"
        href="javascript:;"
        @click="gotoRouter"
      >
        <span class="iconfont icon-sort_desc"></span>
      </a>
      <h1 class="title title-white unBorder">登录</h1>
    </header>
    <div class="content content-padded">
      <input type="hidden" name id="message" />
      <article class="card">
        <div class="card-header">
          <div class="lr-header">唯实教育</div>
        </div>
        <div class="card-content lr__wrap">
          <div class="card-content-inner">
            <div class="list-block">
              <ul class="lr-content__wrap">
                <li>
                  <div>
                    <div class="item-input form-control pr">
                      <span class="lr-tel-ico new-tel-ico">
                        <em class="iconfont icon-shoujidenglu"></em>
                      </span>
                      <input
                        type="text"
                        style="outline: none;"
                        v-model="loginObj.loginName"
                        id="account"
                        placeholder="请输入登录账号"
                      />
                    </div>
                  </div>
                </li>
                <li>
                  <div>
                    <div class="item-input form-control pr">
                      <span class="lr-tel-ico new-tel-ico">
                        <em class="iconfont icon-mima"></em>
                      </span>
                      <input
                        type="text"
                        style="outline: none;"
                        id="accoun"
                        v-model="loginObj.loginKey"
                        placeholder="请输入登录密码"
                      />
                    </div>
                  </div>
                </li>
                <li>
                  <div class="clearfix">
                    <div class="pull-right">
                      <a class="lr-links" @click="gotoLogon" href="javascript:;">注册新账号</a>
                    </div>
                    <!-- <div class="pull-left">
                          <a class="lr-links" href>忘记密码</a>
                    </div>-->
                  </div>
                </li>
              </ul>
              <div class="content-block">
                <div class="lr-suBtn__wrap">
                  <button class="button button-big button-round" @click="loginFn">登录，进入唯实教育</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </article>
    </div>
  </div>
</template>

<script>
import { Toast } from "vant";
import { mapActions } from "vuex";
export default {
  data() {
    return {
      loginObj: {},
      redirect: null
    };
  },
  methods: {
    ...mapActions("login", ["userLogin", "getInfo"]),
    gotoLogon() {
      this.$router.push("/logon");
    },
    async loginFn() {
      if (!this.loginObj.loginName) {
        Toast("请输入登陆账号");
        return;
      } else if (!this.loginObj.loginKey) {
        Toast("请输入登陆密码");
        return;
      }
      let r = await this.userLogin(this.loginObj);
      if (r.data.code !== 20000) {
        Toast("账号或密码错误");
        return;
      }
      let res = await this.getInfo();
      // window.history.go(-1);
      this.$router.push({ path: this.redirect || "/" });
      this.loginObj = {};
    },
    gotoRouter() {
      if (window.history.go(-1)) {
        window.history.go(-1);
        return;
      }
      this.$router.push("/");
    }
  },
  components: {
    vanToast: Toast
  },
  watch: {
    $route: {
      handler: function(route) {
        this.redirect = route.query && route.query.redirect;
      },
      immediate: true
    }
  }
};
</script>

<style scoped src="../.././css/main.css"></style>
<style scoped src="../.././css/login/icon/iconfont.css"></style>
<style scoped src="../.././css/login/index.css"></style>
<style scoped>
</style>